<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>

        p:first-child {
            color: seagreen;
        }

        .item p:last-child {
            color: blue;
        }


        .line {
            height: 1px;
            width: 500px;

            border-style: solid;
            border-color: #bcbcbc;
            border-width: 0 0 3px 0;
        }

        .docs-card {
            height: 120px;
            width: 300px;
            line-height: 120px;
            text-align: center;
            border-radius: 8px;
            box-shadow: 0 0 10px #bcbcbc;
            border-color: red;
            border-width: 5px;
            margin: 20px auto;

        }

        .u {
            width: 100px;
            height: 40px;
            border: 1px solid black;
            margin-top: 10px;
        }

        .k .u:last-child {
            background-color: blue;
        }

        p:nth-child(n+3):nth-child(-n+14):nth-child(odd) {
            font-size: 25px;
        }
    </style>
</head>
<body>
<div class="item">
    <p>book first</p>
    <p>book 2</p>
    <p>book 3</p>
    <p>book 4</p>
    <p>book 5</p>
    <p>book 6</p>
    <p>book 7</p>
    <p>book 8</p>
    <p>book 9</p>
    <p>book last</p>
</div>

<div class="line"></div>

<div class="docs-card"> this is a book</div>

<div class="k">
    <div class="u">test 1</div>
    <div class="u">test 2</div>
    <div class="u">test 3</div>
</div>

<div class="divFlex">
    <div></div>
</div>

<script>

    function newFun(fun, ...args) {
        let newObj = {}
        newObj.__proto__ = fun.prototype
        const result = fun.apply(newObj, args)
        return result instanceof Object ? result : newObj
    }

    function Person(name) {
        this.name = name
    }

    Person.prototype.say = function () {
        console.log('say')
    }

    const person = newFun(Person, '张三')
    person.say()
    console.log(person)

</script>
</body>
</html>